<template>
	<view>
		<uni-nav-bar title="群列表" :statusBar="true" left-icon="back" :fixed="true" @clickLeft="$tab.back()"
			:border="false">
		</uni-nav-bar>
		<view class="bg-F8F8F8" style="height: 16rpx;">

		</view>

		<view class="px-20 py-32">
			<view class="" v-for="item in list" :key="item.groupId">
				<view class="flex items-center mt-20"
					@click="$tab.nav(`/pages/chat2/groupChatDetail?id=${item.groupId}`)">
					<image :src="item.groupAvatar" class="image-88 round-8" mode=""></image>
					<view class="ml-20" style="width: calc(100% - 108rpx);">
						<view class="py-28 text-32">
							{{item.groupName}}
						</view>
						<u-line color="#f8f8f8"></u-line>
					</view>
				</view>
				<u-divider></u-divider>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [],
			};
		},
		onShow() {
			this.getData()
		},
		
		methods: {
			async getData() {
				const res = await this.$Api.chat.groupList()
				console.log('群聊列表', res)
				this.list = res.data
			}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #FFFFFF;
	}
	
</style>